<template>
    <div class="tabbar">
        <div class="tabbar_items" path="/discoverm"  @click="itemClick1">发现音乐</div>
        <div class="tabbar_items" path="/mymusic" @click="itemClick">我的音乐</div>
        <div class="tabbar_items">朋友</div>
        <div class="tabbar_items">商城</div>
        <div class="tabbar_items">音乐人</div>
        <div class="tabbar_items">下载客户端</div>
    </div>
</template>

<script>
export default {
    name:'tabbar',

    data(){
        return {
            path1:'/mymusic',
            path2:'/discover',
            path3:'/my/m/music/artist'
         }
    
    },
    methods: {
    itemClick(){
        const cookieStr = window.sessionStorage.getItem("cookie");
        if(!cookieStr)
        this.$router.push(this.path1).catch(err=>{})
        else
        this.$router.push(this.path3)
    },
    itemClick1(){
        this.$router.push(this.path2).catch(err=>{})
    }
    }
}
    
</script>

<style>
.now {
    background-color: pink;
}
.tabbar {
    height: 70px;
    width: 500px;
    display: flex;
    color: #ccc;
    background-color: rgb(36, 36, 36);
    font-size: 14px;
}
.tabbar_items {
      flex: 1;
    line-height: 70px;
    text-align: center;
    color: rgb(255,255,255);
    
}
</style>